<?php
$titre = "Documentation";
require_once('header.php');
?>
<div id="contenu">
    <h1>Documentation</h1>

    <ul id="ancres">
        <li ><a href="#technologies">Technologies utilis&eacute;es</a></li>
        <li><a href="#organisation">Organisation du code</a></li>
        <li><a href="#repartition">R&eacute;partition du travail</a></li>
        <li><a href="#production">Mise en production du jeu</a></li>
        <li><a href="#fonctionnement">Fonctionnement du jeu</a></li>
        <li><a href="#problemes">Probl&egrave;mes li&eacute;s aux choix techniques</a></li>
    </ul>

    <h2 id="technologies">Technologies utilis&eacute;es</h2>
    <p>
        Pour r&eacute;alis&eacute; ce projet, un certains nombre de choix techniques on &eacute;t&eacute; fait
    </p>
    <ul>
        <li>xHTML</li>
        <li>CSS3</li>
        <li>PHP</li>
        <li>Javascript: language de script principalement utilis&eacute; pour dynamiser
            des pages web</li>
        <li>jQuery: Biblioth&egrave;que qui facilite la programmation javascript</li>
    </ul>



    <h2 id="organisation">Organisation du code</h2>
    <p>
        Le code est orgnanis&eacute; en deux grandes parties, les fichiers accessibles
        publiquement par tout le monde et ceux qui sont visibles uniquement par
        l'administrateur du site.
    </p>
    <p>
        Au total, il existe cinq r&eacute;pertoires:   
    </p>
    <ul>
        <li>admin: contient tous les fichiers source accessibles seuleument pour
            l'administrateur</li>
        <li>bdd: contient les classes qui permettent la gestion de la connection
            &agrave; la base de donn&eacute;es</li>
        <li>crypt: contient l'ensemble du code source qui permet la g&eacute;n&eacute;ration
            d'un captcha</li>
        <li>img: contient l'ensemble des images du site</li>
        <li>js: contient les scripts javascript</li>
        <li>modele: contient des classes mod&egrave;le qui am&eacute;liore la lisibilit&eacute; du
            code</li>
    </ul>

    <p>
        Les pages qui sont directement accessibles &agrave; un visiteur sont pr&eacute;sent &agrave; la
        racine du projet.
    </p>

    <p>
        Le projet s'appuie sur une architecture qui suit le principe de la DAO
        (en anglais Data Access Object). Ces objets offre une connection &agrave; la base
        de donn&eacute;es unique grace &agrave; un singleton de connection.
    </p>

    <p>
        &agrave; chaque classe DAO est associ&eacute; une classe mod&agrave;le qui repr&eacute;sente une entit&eacute;
        de l'application. Dans ce projet nous avons deux classes DAO: DAOAdmin et
        DAOMot auquelles sont associ&eacute;es les mod&egrave;les Admin et Mot.
    </p>
    
    <p>
        Les pages visit&eacute;es sont programm&eacute;es de mani&egrave;re proc&eacute;dural mais le reste du
        code est program&eacute; en orient&eacute; objet.
    </p>

    <h2 id="repartition">R&eacute;partition du travail</h2>
    <p>
        Ce jeux a &eacute;t&eacute; con&ccedil;ue dans le cadre d'un projet
        universitaire durant l'ann&eacute;e 2011-2012 par quatre
        &eacute;tudiants:
    </p>

    <ul>
        <li>Aymeric Lacroix</li>
        <li>Alioune Kandji</li>
        <li>Julien Marigny</li>
        <li>Steven Ferey</li>
    </ul>

    <h3>D&eacute;veloppeur du jeu:</h3>
    <ul>
        <li>Julien Marigny</li>
        <li>Steven Ferey</li>
    </ul>

    <h3>D&eacute;veloppeur du panneau d'administration:</h3>
    <ul>
        <li>Aymeric Lacroix</li>
    </ul>

    <h3>D&eacute;veloppeur du moteur de suggestion:</h3>
    <ul>
        <li>Steven Ferey</li>
    </ul>

    <h3>R&eacute;dacteur de la documentation:</h3>
    <ul>
        <li>Julien Marigny</li>
    </ul>

    <h3>Cr&eacute;ateurs du style du jeu:</h3>
    <ul>
        <li>Aymeric Lacroix</li>
        <li>Alioune Kandji</li>
        <li>Julien Marigny</li>
    </ul>

    <h3>Testeurs:</h3>
    <ul>
        <li>Alioune Kandji</li>
        <li>Steven Ferey</li>
        <li>Aymeric Lacroix</li>
        <li>Julien Marigny</li>
    </ul>

    <h2 id="production">Mise en production du jeu</h2>
    
    <p>Pour mettre en production le site, il faut commencer par copier et
        d&eacute;compresser l'archive dans le r&eacute;pertoire public du serveur web.
        Ensuite, il faut cr&eacute;er la base de donn&eacute;es dont un export
        (le fichier export.sql) est disponible dans le r&eacute;pertoire bdd.</p>
    
    <p>Une fois la base cr&eacute;&eacute;, il suffit de se connecter via son navigateur sur
        http://localhost/pendu/ pour acc&eacute;der au site.</p>
    
    <p>Un administrateur est d&eacute;j&agrave; cr&eacute;&eacute; dans la base de donn&eacute;es. Son login est
        "userpendu" et son mot de passe est "pendu".</p>

    <h2 id="fonctionnement">Fonctionnement du jeu</h2>

    <p>
        Le jeu est compos&eacute; d'une partie client (le jeu du pendu) et d'une partie
        d'administration.</p>

    <h3>Le jeu du pendu</h3>

    <p>
        <strong>Colt&eacute; client:</strong>

        Le joueur peut jouer au jeu du pendu sur la page d'accueil du site.
        Il dois deviner un mot et sa traductionn en anglais. Il peut
        &eacute;galement sugg&eacute;rer des nouveaux mots que l'administrateur devra valider
        avant de les voir r&eacute;ellement ajout&eacute; au jeu.
    </p>

    <p>
        Dans la page de suggestion, un captcha a &eacute;t&eacute; ajout&eacute; pour se pr&eacute;venir des
        ajouts intempestifs li&eacute;s &agrave; une mauvaise manipulation de l'utilisateur
        ou de l'attaque de robots. Une traduction automatique du fran&ccedil;ais vers l'
        anglais est &eacute;galement propos&eacute; pour faciliter la suggestion de nouveaux mots.    
        Une notification apparait pour indiqu&eacute; si le mot est disponible ou non.
    </p>

    <p>
        Le clavier du jeu contient les 24 lettres de l'alphabet fran&ccedil;ais. Pour
        sugg&eacute;rer des mots valides, une transormation est effectu&eacute;e: les mots
        propos&eacute;s sont mis en majuscules et les caract&egrave;res accentu&eacute;s sont remplac&eacute;s
        par le caract&egrave;re non accentu&eacute; correspondant.
    </p>

    <p>
        <strong>Cot&eacute;s serveur:</strong>
        Au d&eacute;but de la partie, le serveur initialise le jeu en mettant en session
        les mots &agrave; trouver et les mots d&eacute;couverts.
        Le serveur dialogue avec le client via une chaine structur&eacute; en suivant
        les indications du sujet:
    </p>
    <p>
        0#eadbae54ee3093a290c913ed59de6f40#1#______#________#SAMEDI#SATURDAY
    </p>
    <p>
        En d&eacute;coupant la chaine, on obtient un tableau dans lequel sont pr&eacute;sent dans
        l'ordre:
    </p>
    <ul>
        <li>Un premier caract&egrave;re indiquant la lettre trouv&eacute; (0 si le joueur n'a
            pas trouv&eacute; de lettre, 1 si le joueur a gagner et 2 si il a perdu)</li>
        <li>L'identifiant de session de l'utilisateur</li>
        <li>Le num&eacute;ro du tour</li>
        <li>Le nombre de coup rat&eacute; du joueur</li>
        <li>Le mot fran&ccedil;ais tel que le joueur l'a trouv&eacute; (avec des lettres 
            masqu&eacute;s)</li>
        <li>Le mot anglais tel que le joueur l'a trouv&eacute; (avec des lettres
            masqu&eacute;)</li>
        <li>Le mot fran&ccedil;ais en clair (seulement si le joueur active la triche)
        </li>
        <li>Le mot anglais en clair (seulement si le joueur active la triche)</li>
    </ul>



    <h3 id="administration">La partie administration</h3>

    Une partie administration permet de valider, modifier ou supprimer les
    mots sugg&eacute;r&eacute;s par les joueurs.

    Avant d'acc&eacute;der &agrave; la partie d'administration du site, l'utilisateur
    dois se connecter. Une variable est alors cr&eacute;&eacute;e en session
    lorsque l'utilisateur a r&eacute;ussi &agrave; se loguer, lors de la
    d&eacute;connexion, cette variable est d&eacute;truite.
    



    <h2 id="problemes">Probl&egrave;mes li&eacute;s aux choix techniques</h2>

    Plusieurs probl&egrave;mes ont &eacute;t&eacute; rencontr&eacute;s lors du d&eacute;veloppement du jeu.
    La traduction automatique utilisait initialement l'api google traduction mais les
    r&eacute;centes limitations de l'utilisation gratuite de cet api ont forc&eacute;
    l'adoption d'une autre api de traduction, celle de microsoft: bing
    traduction.

    L'utilisation de certain composants jQuery a pos&eacute; probl&egrave;me pour rendre
    le site valide au W3C.
    
    Un bug est pr&eacute;sent dans le composant jQuery qui affiche le menu, la page soulign&eacute;e
    reste la premi&egrave;re et ne suit pas la page courante.



</div>
<?php
include('footer.php');
?>